<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <title>个人贷款申请页面</title>
    <!--1.引入 bootstrap 框架全局样式 -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
    <!--2.引入 angularJS 分页的样式 -->
    <link rel="stylesheet" href="angularjs/pagination.css">
    <!--3.引入 jquery 框架类库 -->
    <script src="bootstrap/js/jquery.min.js"></script>
    <!--4.引入 bootstrap 框架类库 -->
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <!--5.引入 angularJS 框架类库 -->
    <script src="angularjs/angular.min.js"></script>
    <!--6.引入 angularJS 框架分页的类库 -->
    <script src="angularjs/pagination.js"></script>
    <!--7.引入layer css-->
    <link rel="stylesheet" href="https://www.layuicdn.com/layui/css/layui.css">
    <!--8.引入layer js-->
    <script src="https://www.layuicdn.com/layui/layui.js"></script>
    <style>
        img{
            width:230px;height:180px;
        }
    </style>
    <script>
        var app = angular.module("FroAloanApp", ['ngCookies']).config(function ($httpProvider) {
            $httpProvider.defaults.useXDomain = true;
            delete $httpProvider.defaults.headers
                .common['X-Requested-With']
        });
        app.controller("FroAloanController", function ($scope, $http, $window, $cookieStore,$element) {
            //定义数据
            $scope.borrowerInfo = {
                "idCardPositive":"img/11.png",
                "idCardReverse":"img/10.png",
            };
            $scope.name =$window.localStorage.getItem("nickname");
            //定义男女数组
            $scope.items = [{names:"男",sex:"1"},
                {names:"女",sex:"0"}];
            //定义学历数组
            $scope.arry = [{education:"博士"},
                {education:"研究生"}, {education:"本科"},
                {education:"专科"},{education:"高中"},
                {education:"初中"},{education:"小学"}];
            //定义已婚未婚数组
            $scope.arrys = [{isMarry:"1",marry:"已婚"},
                {isMarry:"0",marry:"未婚"}];
            //定义期数数组
            $scope.intems = [{num:"3"},
                {num:"6"},{num:"9"},{num:"12"}];
            //定义联系人关系数组
            $scope.istems = [{contactsRelation:"1",namess:"父母"},
                {contactsRelation:"2",namess:"亲戚"},{contactsRelation:"3",namess:"朋友"}];

            var index;
            //点击图片打开上传按钮
            $scope.openUpload = function (a) {
                index = a;
                console.log(a);
                $element.find("input[type='file']")[a].click();

            };
            //上传身份证
            $scope.change = function (){
                  var formData=new FormData();//是HTML5中新增的一个类，专门用于文件上传
                if (index ===0){
                    formData.append("file",file.files[0]);   //前面的file代表key 后面的file代表文件上传框的id，.files[0]代表取页面的第一个文件上传框
                    console.log("过来了0",formData)
                }else if (index ===1){
                    formData.append("file",filea.files[0]);
                }
                $http({		//angularjs的另一种写法
                      method:'POST',
                      url:"http://localhost:10088/user/upload",
                      data: formData,	//formData作为载体上传文件
                      headers: {'Content-Type':undefined,"auth":localStorage.getItem("token")},	//头信息设置为不指定类型，默认是json
                      transformRequest: angular.identity		//表示对整个表单进行二进制序列化
                  }).success(function (data) {
                    if (data.code === 200) {
                        //当index=0时更新正面 当index=1时更新反面
                       if (index===0){
                           $scope.borrowerInfo.idCardPositive = data.data;
                       }else if (index===1){
                           $scope.borrowerInfo.idCardReverse = data.data;
                       }

                    }
                });
            };
            $scope.commit =function () {
                //后续需要从登陆成功页面拿到token跟用户id现在先默认userid=1
                var token = $window.localStorage.getItem("token");
                console.log(token);
                $scope.borrowerInfo.sex = $scope.data.sex;
                $scope.borrowerInfo.education = $scope.data2.education;
                $scope.borrowerInfo.isMarry = $scope.data3.isMarry;
                $scope.borrowerInfo.num = $scope.data4.num;
                $scope.borrowerInfo.contactsRelation=$scope.data5.contactsRelation;
                $scope.borrowerInfo.token = token;
                $http.post("http://localhost:10088/user/addBorrowerInfo", $scope.borrowerInfo,{
                    headers : {'auth' : token}
                }).success(function (data) {
                    if (data.code === 200) {
                        layer.msg(data.msg);
                        $window.location.href = "gerenzhongxin/个人中心首页.html";
                    } else {
                        layer.msg(data.msg);
                    }
                });
            };
            //退出登录
            $scope.logout = function () {
                $window.localStorage.setItem("token", "");
                $window.location.href = "gerenzhongxin/login.html";
            }

        });
    </script>
</head>
<body ng-app="FroAloanApp" ng-controller="FroAloanController">
<div class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">金证信贷系统</a>
        </div>
        <ul class="nav navbar-nav">
            <li class="active"><a href="javascript:void(0)" >用户管理</a></li>

        </ul>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="gerenzhongxin/个人中心首页.html"><span></span>首页</a></li>
            <li><a href="#"><span class="glyphicon glyphicon-user"></span> {{name}}</a></li>
            <li><a href="javascript:void(0)" ng-click="logout()"><span class="glyphicon glyphicon-log-in"></span>注销</a>
            </li>
        </ul>

    </div>

</div>
<div class="container-fluid">
    <div class="panel panel-primary">
        <div class="panel-heading" style="text-align: center">
            <h2>申请贷款信息填写</h2>
        </div>
        <div class="panel-body">
            <form role="form" name="angularForm">
                <div class="modal-body " id="model-body">
                    <div class="form-group">
                        <div class="row">
                            <div class="col-lg-2">
                                <input type="text" class="form-control" required="required" placeholder="请输入真实姓名"
                                       autocomplete="off"
                                       ng-model="borrowerInfo.name" ng-blur="checkName()">

                            </div>
                            <div class="col-lg-3">
                                <input type="text" class="form-control" placeholder="请输入身份证号" autocomplete="off"
                                       ng-model="borrowerInfo.idCard" ng-blur="checkAccount()">
                            </div>
                            <div class="col-lg-4">
                                <input type="text" ng-model="borrowerInfo.mobile" class="form-control" placeholder="请输入手机号码" autocomplete="off">
                            </div>

                            <div class="col-lg-2">
                                <select class="form-control" ng-model="data" ng-options="item.names for item in items">

                                </select>
                            </div>
                        </div>

                    </div>
                    <div class="form-group">
                        <div class="row">

                            <div class="col-lg-2">
                                <select class="form-control" ng-model="data2" ng-options="arry.education for arry in arry">

                                </select>
                            </div>
                            <div class="col-lg-2">
                                <input type="text" ng-model="borrowerInfo.postcode" class="form-control" placeholder="请输入邮政编码" autocomplete="off">
                            </div>
                            <div class="col-lg-3">
                                <input type="text" ng-model="borrowerInfo.address" class="form-control" placeholder="请输入家庭住址" autocomplete="off">
                            </div>
                            <div class="col-lg-2">
                                <select class="form-control" ng-model="data3" ng-options="arrys.marry for arrys in arrys">

                                </select>
                            </div>

                        </div>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <div class="col-lg-2">
                                <input type="text" ng-model="borrowerInfo.enterprise" class="form-control" placeholder="公司名称若无则填无"/>
                            </div>
                            <div class="col-lg-3">
                                <input type="text" ng-model="borrowerInfo.enterpriseAddress" class="form-control" placeholder="公司地址若无直接填无即可"/>
                            </div>
                            <div class="col-lg-4">
                                <input type="text" ng-model="borrowerInfo.industry" class="form-control" placeholder="请输入从事的行业若无直接填无即可"/>
                            </div>
                            <div class="col-lg-2">
                                <input type="number" class="form-control" ng-model="borrowerInfo.income"  placeholder="请输入你的月收入"/>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <div class="col-lg-3">
                                <input type="number" class="form-control" ng-model="borrowerInfo.amount" placeholder="请输入你的借款金额"/>
                            </div>
                            <div class="col-lg-3">
                                <input type="text" class="form-control" ng-model="borrowerInfo.returnSource" placeholder="请输入你的借款金额还款来源"/>
                            </div>
                            <div class="col-lg-3">
                                <input type="text" class="form-control" ng-model="borrowerInfo.bankNo" placeholder="请输入你的收款卡号"/>
                            </div>
                            <div class="col-lg-2">
                                分期期数:
                                <select class="form-control" ng-model="data4" ng-options="intems.num for intems in intems" >

                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <div class="col-lg-3">
                                <input type="text" ng-model="borrowerInfo.contactsName" class="form-control" placeholder="请输入紧急联系人姓名"/>
                            </div>
                            <div class="col-lg-3">
                                <input type="text" class="form-control" ng-model="borrowerInfo.contactsMobile" placeholder="请输入紧急联系人手机号"/>
                            </div>
                            <div class="col-lg-2">
                                <select class="form-control" ng-model="data5" ng-options="istems.namess for istems in istems">

                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <textarea class="form-control" ng-model="borrowerInfo.evaluation" placeholder="个人评价非必填"></textarea>
                    </div>
                    <div class="form-group">
                        <div class="row">
                            <div class="col-lg-3">
                                <input type="file" id="file" name="file" style="display: none" onchange="angular.element(this).scope().change()"/>
                                <div class="col-md-12">
                                    <img ng-src={{borrowerInfo.idCardPositive}}  ng-click="openUpload(0)"/>
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <input type="file" id="filea" name="file" style="display: none" onchange="angular.element(this).scope().change()"/>
                                <div class="col-md-12">
                                    <img ng-src={{borrowerInfo.idCardReverse}}
                                          ng-click="openUpload(1)"/>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="form-group">
                        <button type="button" class="btn btn-primary form-control" value="提交申请" ng-click="commit()">提交申请
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
</html>